<template>
  <div class="upload-jss">
    <Breadcrumb>
      <BreadcrumbItem v-for="(name, i) in breadcrumb" :key="i">{{ name }}</BreadcrumbItem>
    </Breadcrumb>
    <div class="wrap">
      <Form ref="formItem" :model="formItem" :rules="formRule" :label-width="120" label-position="left">
        <FormItem prop="saveJs" label="微信配置文件：">
          <Input type="text" readonly v-model="formItem.saveJs" placeholder="安全域名JS" style="width: 300px;">
            <Upload
              action="/bomc/common/uploadWxJs"
              :headers="headers"
              :before-upload="beforeSaveJs"
              :on-success="saveJsSuccess"
              slot="append"
              class="js-com"
            >
              <Button type="primary" class="upload-js">上传</Button>
            </Upload>
          </Input>
        </FormItem>
        <!-- <FormItem prop="webPageJs" label="网页授权JS：">
          <Input type="text" readonly v-model="formItem.webPageJs" placeholder="网页授权JS" style="width: 300px;">
            <Upload
              action="/bomc/common/uploadWxJs"
              :headers="headers"
              :before-upload="beforeSaveJs"
              :on-success="webPageSuccess"
              slot="append"
              class="js-com"
            >
              <Button type="primary" class="upload-js">上传</Button>
            </Upload>
          </Input>
        </FormItem> -->
      </Form>
    </div>
  </div>
</template>

<script>
import Api from '@/api'

const merchantApi = Api.DistributionPartnerInfo

export default {
  name: 'uploadjs',
  data() {
    return {
      breadcrumb: ['商户人员管理', '上传js文件'],
      formItem: {
        saveJs: '',
        // webPageJs: ''
      },
      formRule: {},
      headers: { 'qf-channel-bomc-token': sessionStorage.getItem('token') }
    }
  },
  methods: {
    beforeSaveJs(file) {
      let upload = true
      const isLt1M = file.size / 1024 / 1024
      if (isLt1M > 1) {
        this.$Message.error('上传文件大小不能超过1M')
        upload = false
      }
      return upload
    },
    saveJsSuccess(response, file, fileList) {
      this.formItem.saveJs = file.name
      this.$Message.success('上传成功')
    },
    // webPageSuccess(response, file, fileList) {
    //   this.formItem.webPageJs = file.name
    //   this.$Message.success('上传成功')
    // }
  },
  mounted() {},
}
</script>
<style lang="scss" scoped>
.upload-jss {
  .wrap {
    margin-top: 30px;
  }
  .upload-js {
    color: #fff;
    background-color: #2d8cf0;
    border-color: #2d8cf0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
}
</style>
